@layout("/common/container.html", {"title" : "字典"}){
<form class="e-form">
    <div class="card">
        <#card:head title="字典" icon="la la-book"/>
        <div class="card-body">
            <input type="hidden" id="id" name="id" value="${object.id}">
            <div class="row">
                <div class="col-md-6 col-12">
                    <div class="form-group row">
                        <label class="col-4 col-form-label">
                            <span class="required">*</span>
                            字典类型：
                        </label>
                        <div class="col-8">
                            <select class="form-control e-bootstrap-select select-picker auto-params"
                                    required
                                    data-live-search="true" id="dictType" name="dictType"
                                    data-value="${object.dictType}">
                                @for(dictType in dictTypes){
                                <option value="${dictType.value}">${dictType.text}</option>
                                @}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-12">
                    <div class="form-group row">
                        <label class="col-4 col-form-label" for="pCode">
                            上级字典：
                        </label>
                        <div class="col-8">
                            <select class="form-control e-bootstrap-select select-picker auto-params"
                                    data-live-search="true" id="pCode" name="pCode" data-value="${object.pCode}">
                                <option value="">无</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-12">
                    <#form:input id="code" value="${object.code}" name="字典编码" required="true" placeholder="字母或数字"/>
                </div>
                <div class="col-md-6 col-12">
                    <#form:input id="name" value="${object.name}" name="字典名称" required="true"/>
                </div>
                <div class="col-md-6 col-12">
                    <div class="form-group row">
                        <label class="col-4 col-form-label">
                            <span class="required">*</span>
                            状态：
                        </label>
                        <div class="col-8">
                            <div class="radio-dict" data-dict-type="commonStatus" data-value="${object.status}" data-name="status" data-required="true"></div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-12">
                    <#form:input id="orderNo" value="${object.orderNo}" name="排序值" type="number" tips="按照升序排列" />
                </div>
                <div class="col-md-6 col-12">
                    <div class="form-group row">
                        <label class="col-4 col-form-label" for="css">
                            颜色：
                            <i data-toggle="e-tooltip" data-placement="top" data-original-title="列表中字段颜色"
                               class="flaticon-questions-circular-button"></i>
                        </label>
                        <div class="col-8">
                            <select class="form-control e-bootstrap-select select-picker"
                                    id="css" name="css" data-value="${object.css}">
                                <option value="" selected></option>
                                <option value="badge badge-dark badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-dark badge--inline badge--pill badge--rounded'>黑色</span>"></option>
                                <option value="badge badge-brand badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-brand badge--inline badge--pill badge--rounded'>主色调</span>"></option>
                                <option value="badge badge-info badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-info badge--inline badge--pill badge--rounded'>蓝色</span>"></option>
                                <option value="badge badge-success badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-success badge--inline badge--pill badge--rounded'>绿色</span>"></option>
                                <option value="badge badge-warning badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-warning badge--inline badge--pill badge--rounded'>黄色</span>"></option>
                                <option value="badge badge-danger badge--inline badge--pill badge--rounded"
                                        data-content="<span class='badge badge-danger badge--inline badge--pill badge--rounded'>红色</span>"></option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-12">
                    <div class="form-group row">
                        <label class="col-4 col-form-label" for="icon">
                            图标：
                            <i data-toggle="e-tooltip" data-placement="top" data-original-title="自定义图标"
                               class="flaticon-questions-circular-button"></i>
                        </label>
                        <div class="col-8">
                            <div class="input-group e-input-group e-input-group--square">
                                <div class="input-group-prepend">
                                    <span class="input-group-text input-group-text-sm" id="dict-icon">
                                        <i class="${object.icon}"></i>
                                    </span>
                                </div>
                                <input type="text" class="form-control" id="icon" name="icon"
                                       aria-describedby="permissions-icon" value="${object.icon}">
                                <div class="input-group-append">
                                    <button class="btn btn-secondary btn-icon" type="button" data-toggle="modal"
                                            data-target="#icon_modal">
                                        <i class="la la-search"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12">
                    <#form:textarea id="tips" value="${object.tips}" name="备注"/>
                </div>
            </div>
        </div>
        <div class="card-foot">
            <div class="e-form-actions text-center">
                <#btn:save permission="sys:dict:save"/>
            </div>
        </div>
    </div>
</form>
<!-- begin:: 图标 -->
<div class="modal fade icon_modal" id="icon_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">点击下方列表中的图标选择</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                @include("/common/icon.html"){}
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-info">确认</button>
            </div>
        </div>
    </div>
</div>
<!-- end:: 图标 -->
<!--begin::页面脚本 -->
<#script src="static/modular/sys/dict/input.js" />
<!--end::页面脚本 -->
@}